<template>
  <div class="order">
    <van-cell-group>
      <van-cell
        :title="
          checkedAddress.province + checkedAddress.city + checkedAddress.county
        "
      />
      <van-cell
        :title="checkedAddress.city + checkedAddress.county"
        is-link
        :label="checkedAddress.name + ' ' + checkedAddress.tel"
        to="/addresslist"
      />
      <div v-for="(item, index) in checkedGoodsList" :key="index">
        <van-card
          num="1"
          :price="item.price | pr"
          :title="item.goodsName"
          :desc="item.specifications"
          :thumb="item.picUrl"
        />
      </div>
      <van-cell title="商品金额" :value="price|Price" />
      <van-cell title="发票" is-link value="个人" />
    </van-cell-group>
    <van-submit-bar
      :price="price*100"
      button-text="提交订单"
      @submit="onSubmit"
    />
  </div>
</template>

<script>
import { Cell, CellGroup, Card, SubmitBar } from "vant";
import API from "@/utils/api.js";
export default {
  name: "Order",
  data() {
    return {
      cartId: this.$route.query.cartId,
      checkedAddress: [],
      checkedGoodsList: [],
      price: 0,
    };
  },
  created() {
    this.$get(API.GET_CART_CHECKOUT, {
      token: this.$store.state.token,
    }).then((res) => {
      console.log("及", res);
      this.checkedAddress = res.data.checkedAddress;
      this.checkedGoodsList = res.data.checkedGoodsList;
      this.checkedGoodsList.forEach((item) => {
        this.price = item.price;
      });
    });
  },
  methods: {
    onSubmit() {
        this.$post(API.POST_ORDER_SUBMIT,{
            token: this.$store.state.token,
            cartId:0,
            addressId:this.checkedAddress.id,
            couponId: 0,
            userCouponId:0,
            grouponRulesId:0,
            grouponLinkId:0
        }).then(res=>{
            console.log(res)
        })
        this.$router.push({ path: 'orderlist'})
    },
  },
  components: {
    [Cell.name]: Cell,
    [CellGroup.name]: CellGroup,
    [Card.name]: Card,
    [SubmitBar.name]: SubmitBar,
  },
  filters: {
    Price: (value) => {
      return "￥" + value + ".00";
    },
    pr:(value)=>{
      return  value + ".00";
    }
  },
};
</script>

<style lang="less" scoped>
.order {
  margin-top: 46px;
  .van-card__price {
    color: rgb(238, 74, 74);
  }
}
</style>